/* 标签页相关逻辑 */
import { ref } from 'vue';
import { isString, isArray } from '@/shared/index.js';

/**
 * 
 * @param {string} _activeName 默认的选择的标签页
 * @param {Array<string> or undefined} nameArray 所有的标签页名称信息
 * @returns 
 */
export const useTabs = (_activeName = 'one', nameArray) => {

  const activeName = ref(_activeName);/* 默认选择one标签页，1,2,3,4,5英文名的方式命名（你也可以修改成其他命名方式） */

  handleInitVerify();
  /* 初始化校验参数 */
  function handleInitVerify () {
    if (isString(nameArray)) console.error('选项卡数据需要是一个数组');
    if (isArray(nameArray) && nameArray.length === 0) console.error('选项卡数据需要是一个非空数组');
  }
  /* 切换标签页 */
  function setActiveName (name) {
    /* 用方法而不是直接赋值也有它的意义，比如做一些name的有效值的判断，但这也有前提就是，name需要维护 */
    if (nameArray !== undefined && !nameArray.includes(name)) console.warn('选项卡的名称可能填写错误 或 需要维护一下所有选项卡信息');
    activeName.value = name;
  }

  /* 处理切换标签页 */
  function handleChangeTabs (tab, event) {
    // console.log(tab, event);
  }

  /* 初始化tags页 */
  function handleTagsInit () {
    setActiveName(_activeName);
  }

  return {
    activeName,
    setActiveName, handleChangeTabs, handleTagsInit
  }
}